<ion-content padding class="bgWebp">
  <!-- <video  loop="loop" autoplay="autoplay"
  src="assets/mp4/bgVideo.mp4" class="video-tvc"></video> -->
  <ion-header>
    <ion-toolbar>
      <ion-buttons slot="start">
        <ion-button (click)="backClick()">
          <ion-icon class="md-arrow-back"  ios="md-arrow-back"></ion-icon>
        </ion-button>
      </ion-buttons>
    </ion-toolbar>
  </ion-header>
  <div class="auth-content">
    <!-- Logo -->
    <div padding-horizontal text-center class="animated fadeInDown">
      <div class="logo">
        <img src="assets/img/login_icon.png" style="width:80px;" />
      </div>
    </div>
    <!-- Register form -->
    <form [formGroup]="onRegisterForm" class="list-form">
      <ion-item no-padding class="animated fadeInUp" lines="none">
        <ion-icon class="iconfont  ion-ios-yonghu1" style="font-size: 24px" slot="start"></ion-icon>
        <ion-input placeholder="用户名" type="text" (ionChange)="onChangeFun()" formControlName="fullName"></ion-input>
        <p class="regist-error" slot="end">{{errorMsg}}</p>
      </ion-item>
      <ion-item no-padding class="animated fadeInUp" lines="none">
        <ion-icon class="iconfont  ion-ios-shoujihao" style="font-size: 24px" slot="start"></ion-icon>
        <ion-input type="text" placeholder="手机号" formControlName="mobile"></ion-input>
      </ion-item>
      <ion-item no-padding class="animated fadeInUp" lines="none">
        <ion-icon class="iconfont  ion-ios-qunfengxiugaimima" style="font-size: 24px" slot="start"></ion-icon>
        <ion-input type="password" placeholder="密码" formControlName="password"></ion-input>
      </ion-item>
      <ion-item no-padding class="animated fadeInUp" lines="none">
        <ion-icon class="iconfont  ion-ios-qunfengxiugaimima" style="font-size: 24px" slot="start"></ion-icon>
        <ion-input type="password" placeholder="确认密码" formControlName="repassword"></ion-input>
      </ion-item>
      <ion-item no-padding class="animated fadeInUp" lines="none">
        <ion-icon class="iconfont  ion-ios-yaoqing" style="font-size: 24px" slot="start"></ion-icon>
        <ion-input type="text" placeholder="邀请码" [readonly]="isReadOnly" [(ngModel)]="inviteCodeVal" formControlName="inviteCode"></ion-input>
      </ion-item>
      <div style="position: relative;">
        <ion-item no-padding class="animated fadeInUp" lines="none">
          <ion-icon class="iconfont  ion-ios-qunfengxiugaimima" style="font-size: 24px" slot="start"></ion-icon>
          <ion-input type="text" placeholder="验证码" formControlName="imgcode" style="padding-right: 30px;"></ion-input>
        </ion-item>
        <img [src]="codeImg" (click)="refreshCode()" style="position: absolute; bottom: 12px; right: 10px; z-index: 100;"/>
      </div>
    </form>
    <div margin-top>
      <ion-button size="medium" shape="round" expand="block" color="primary01" (click)="registClick()"
        [disabled]="!onRegisterForm.valid" tappable>
        <ion-icon name="log-in"></ion-icon>
        注册
      </ion-button>
      <p text-center class="paz" (click)="loginPage()">
        <ion-text>
          已有账号
        </ion-text>
      </p>
    </div>
  </div>
</ion-content>